<template>
    <div class="copyEntry">
        <!-- 操作记录 -->
        <el-dialog title="操作记录" :visible.sync="dialogVisible" width="50%" top="5vh" custom-class="import-dialog" :close-on-click-modal="false">
            <div
                v-for="item in IndexSourceOperatorLog"
                :key="item.operationLogCode"
            >
                <div style="color:#a7f331">【{{item.modifyType==1?'新增':item.modifyType==2?'修改':'删除'}}来源】</div>
                <div style="color:#de1f37; margin: 5px 0">
                    <span>&nbsp;&nbsp;&nbsp;&nbsp;{{item.modifyDate}} {{item.modifyTime}}&nbsp;&nbsp;{{item.modifyUser}} </span>
                    <span v-for="(item2, index) in item.modifyText[0].IndexSourceCategoryDetail" :key="index">   
                        <span>【{{item2.moduleDetail}}】</span> 
                        <span v-if="item.modifyType==1">{{item2.afterChange}}</span>
                        <span v-else-if="item.modifyType==2">{{item2.beforeChange}}<span style="color: black">--></span>{{item2.afterChange}}</span>
                        <span v-else-if="item.modifyType==3">{{item2.beforeChange}}</span>
                        <span v-if="!(index == item.modifyText[0].IndexSourceCategoryDetail.length - 1)">、</span>
                    </span>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script lang="ts">
import { Component, Vue, Watch, Prop } from 'vue-property-decorator';
import { timeFormat } from '@/utils/tools';

@Component({
    name: 'EntryRecordDialog',
    components: {
    },
})
export default class EntryRecordDialog extends Vue {
    @Prop() entryRecordDialog;
    @Prop() entryRecordItem;
    private dialogVisible: boolean = false;
    private IndexSourceOperatorLog = [];
    @Watch('entryRecordDialog')
    watchEntryRecordDialog(val) {
        if (val == true) {
            this.$axios.post('/indexSource/getIndexSourceOperatorLog/' + this.entryRecordItem.id).then((res: any) => {   
                if (res) {
                    this.IndexSourceOperatorLog = [];
                    this.dialogVisible = val;
                    res.forEach(item => {
                        let modifyTexts = JSON.parse(item.modifyText)
                        item.modifyText = modifyTexts;
                        let modifyTimes = item.modifyTime;
                        item.modifyTime = timeFormat(modifyTimes, true);
                        this.IndexSourceOperatorLog.push(item);
                    })  
                }
            }); 
        }
    }
    @Watch('dialogVisible')
    watchDialogVisible(val) {
        if (val == false) {
            this.$emit('emitEntryRecordDialog', false)
        }
    }
}
</script>
<style lang="scss" scoped>
</style>
